import 'package:flutter/material.dart';
import 'package:flutter_2b_client/store/EmployeeAuthorizationStore.dart';
import 'package:flutter_2b_client/utils/MobxHooks.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:go_router/go_router.dart';
import 'package:provider/provider.dart';

class GridNavigationItem {
  final String iconPath;
  final String path;
  final String label;
  final String authority;

  GridNavigationItem(this.iconPath, this.path, this.label, this.authority);
}

class HomePage extends HookWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var store = Provider.of<EmployeeAuthorizationStore>(context);
    var authorities = useObservable(() => store.me?.authorities);
    final gridNavigationItems = useMemoized(
        () => [
              GridNavigationItem(
                  "assets/icons/home.png", "/markets", "卖场", "卖场_查询"),
              GridNavigationItem(
                  "assets/icons/search product.png", "/goods", "商品", "货品_查询"),
              GridNavigationItem("assets/icons/receipt.png",
                  "/checkInventoryRecords", "盘点", "库存_盘点_查询"),
              GridNavigationItem("assets/icons/receipt.png",
                  "/goodsScratches", "草稿单", "货品_草稿单"),
            ]
                .where((element) =>
                    (authorities ?? []).contains(element.authority) == true)
                .toList(),
        [authorities]);

    return Scaffold(
      body: GridView(
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 3, childAspectRatio: 1.0),
        children: gridNavigationItems
            .map(
              (e) => InkWell(
                onTap: () {
                  context.push(e.path);
                },
                child: Card(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: [
                      Image.asset(
                        e.iconPath,
                        width: 72,
                        height: 72,
                      ),
                      Text(
                        e.label,
                        style: Theme.of(context)
                            .textTheme
                            .bodyLarge
                            ?.copyWith(letterSpacing: 4),
                      ),
                    ],
                  ),
                ),
              ),
            )
            .toList(),
      ),
    );
  }
}
